<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8"/>
  <title>IconFont Demo</title>
  <link rel="shortcut icon" href="https://img.alicdn.com/tps/i4/TB1_oz6GVXXXXaFXpXXJDFnIXXX-64-64.ico" type="image/x-icon"/>
  <link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
  <link rel="stylesheet" href="demo.css">
  <link rel="stylesheet" href="iconfont.css">
  <script src="iconfont.js"></script>
  <!-- jQuery -->
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
  <!-- 代码高亮 -->
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
</head>
<body>
  <div class="main">
    <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">&#xe86b;</a></h1>
    <div class="nav-tabs">
      <ul id="tabs" class="dib-box">
        <li class="dib active"><span>Unicode</span></li>
        <li class="dib"><span>Font class</span></li>
        <li class="dib"><span>Symbol</span></li>
      </ul>
      
      <a href="https://www.iconfont.cn/manage/index?manage_type=myprojects&projectId=1410090" target="_blank" class="nav-more">查看项目</a>
      
    </div>
    <div class="tab-container">
      <div class="content unicode" style="display: block;">
          <ul class="icon_lists dib-box">
          
            <li class="dib">
              <span class="icon iconfont">&#xe61d;</span>
                <div class="name">统计报表</div>
                <div class="code-name">&amp;#xe61d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe642;</span>
                <div class="name">信息登记</div>
                <div class="code-name">&amp;#xe642;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61e;</span>
                <div class="name">查询</div>
                <div class="code-name">&amp;#xe61e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe606;</span>
                <div class="name">物流</div>
                <div class="code-name">&amp;#xe606;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe626;</span>
                <div class="name">柱形图</div>
                <div class="code-name">&amp;#xe626;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe68b;</span>
                <div class="name">饼图</div>
                <div class="code-name">&amp;#xe68b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe605;</span>
                <div class="name">模板管理</div>
                <div class="code-name">&amp;#xe605;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6e5;</span>
                <div class="name">折线图</div>
                <div class="code-name">&amp;#xe6e5;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe650;</span>
                <div class="name">统计表</div>
                <div class="code-name">&amp;#xe650;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe627;</span>
                <div class="name">进度查询</div>
                <div class="code-name">&amp;#xe627;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe620;</span>
                <div class="name">保养质检单</div>
                <div class="code-name">&amp;#xe620;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe67b;</span>
                <div class="name">回传2</div>
                <div class="code-name">&amp;#xe67b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe634;</span>
                <div class="name">来料质检</div>
                <div class="code-name">&amp;#xe634;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe778;</span>
                <div class="name">操作-记录</div>
                <div class="code-name">&amp;#xe778;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe628;</span>
                <div class="name">党务任务管理</div>
                <div class="code-name">&amp;#xe628;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe617;</span>
                <div class="name">异常答复</div>
                <div class="code-name">&amp;#xe617;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe67a;</span>
                <div class="name">快递，送货</div>
                <div class="code-name">&amp;#xe67a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe630;</span>
                <div class="name">操作记录</div>
                <div class="code-name">&amp;#xe630;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe69c;</span>
                <div class="name">监控,追踪,跟踪_jurassic</div>
                <div class="code-name">&amp;#xe69c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe636;</span>
                <div class="name">数据字典</div>
                <div class="code-name">&amp;#xe636;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe615;</span>
                <div class="name">表格</div>
                <div class="code-name">&amp;#xe615;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe639;</span>
                <div class="name">表格</div>
                <div class="code-name">&amp;#xe639;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62c;</span>
                <div class="name">服务监控</div>
                <div class="code-name">&amp;#xe62c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b0;</span>
                <div class="name">登记</div>
                <div class="code-name">&amp;#xe6b0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8b3;</span>
                <div class="name">排行榜</div>
                <div class="code-name">&amp;#xe8b3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6fb;</span>
                <div class="name">稍后处理</div>
                <div class="code-name">&amp;#xe6fb;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe777;</span>
                <div class="name">邀请</div>
                <div class="code-name">&amp;#xe777;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6fa;</span>
                <div class="name">圈子</div>
                <div class="code-name">&amp;#xe6fa;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe612;</span>
                <div class="name">链接断开</div>
                <div class="code-name">&amp;#xe612;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61a;</span>
                <div class="name">消息</div>
                <div class="code-name">&amp;#xe61a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe623;</span>
                <div class="name">鼠标</div>
                <div class="code-name">&amp;#xe623;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61b;</span>
                <div class="name">下移</div>
                <div class="code-name">&amp;#xe61b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61c;</span>
                <div class="name">上移</div>
                <div class="code-name">&amp;#xe61c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe63b;</span>
                <div class="name">同步1</div>
                <div class="code-name">&amp;#xe63b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe684;</span>
                <div class="name">设置</div>
                <div class="code-name">&amp;#xe684;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7dd;</span>
                <div class="name">打印</div>
                <div class="code-name">&amp;#xe7dd;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7de;</span>
                <div class="name">电费发票</div>
                <div class="code-name">&amp;#xe7de;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7df;</span>
                <div class="name">电子账单</div>
                <div class="code-name">&amp;#xe7df;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7e3;</span>
                <div class="name">全线上</div>
                <div class="code-name">&amp;#xe7e3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7e2;</span>
                <div class="name">查询</div>
                <div class="code-name">&amp;#xe7e2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7e4;</span>
                <div class="name">操作</div>
                <div class="code-name">&amp;#xe7e4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7e5;</span>
                <div class="name">下载模版</div>
                <div class="code-name">&amp;#xe7e5;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe631;</span>
                <div class="name">地球</div>
                <div class="code-name">&amp;#xe631;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe637;</span>
                <div class="name">音量，声音</div>
                <div class="code-name">&amp;#xe637;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe690;</span>
                <div class="name">测验</div>
                <div class="code-name">&amp;#xe690;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe693;</span>
                <div class="name">个人资料</div>
                <div class="code-name">&amp;#xe693;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe694;</span>
                <div class="name">更多</div>
                <div class="code-name">&amp;#xe694;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe696;</span>
                <div class="name">课堂小测</div>
                <div class="code-name">&amp;#xe696;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe697;</span>
                <div class="name">批量管理</div>
                <div class="code-name">&amp;#xe697;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe699;</span>
                <div class="name">首页</div>
                <div class="code-name">&amp;#xe699;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe69a;</span>
                <div class="name">素材中心</div>
                <div class="code-name">&amp;#xe69a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe69e;</span>
                <div class="name">系统</div>
                <div class="code-name">&amp;#xe69e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a0;</span>
                <div class="name">账号中心 账号管理</div>
                <div class="code-name">&amp;#xe6a0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a1;</span>
                <div class="name">资源库</div>
                <div class="code-name">&amp;#xe6a1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a2;</span>
                <div class="name">资源平台管理</div>
                <div class="code-name">&amp;#xe6a2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a3;</span>
                <div class="name">运维管理</div>
                <div class="code-name">&amp;#xe6a3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe853;</span>
                <div class="name">布局</div>
                <div class="code-name">&amp;#xe853;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe85b;</span>
                <div class="name">流程</div>
                <div class="code-name">&amp;#xe85b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe85e;</span>
                <div class="name">用户</div>
                <div class="code-name">&amp;#xe85e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe85f;</span>
                <div class="name">审批中心</div>
                <div class="code-name">&amp;#xe85f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe860;</span>
                <div class="name">图表</div>
                <div class="code-name">&amp;#xe860;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe861;</span>
                <div class="name">资源下载</div>
                <div class="code-name">&amp;#xe861;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe862;</span>
                <div class="name">权限申请</div>
                <div class="code-name">&amp;#xe862;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe757;</span>
                <div class="name">花朵 设置 系统</div>
                <div class="code-name">&amp;#xe757;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe75b;</span>
                <div class="name">雨伞 防护</div>
                <div class="code-name">&amp;#xe75b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe731;</span>
                <div class="name">发现 新球</div>
                <div class="code-name">&amp;#xe731;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73f;</span>
                <div class="name">发现 阅读 观看</div>
                <div class="code-name">&amp;#xe73f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe624;</span>
                <div class="name">回滚</div>
                <div class="code-name">&amp;#xe624;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe75c;</span>
                <div class="name">摄像头 监控</div>
                <div class="code-name">&amp;#xe75c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe75d;</span>
                <div class="name">荣誉 金牌</div>
                <div class="code-name">&amp;#xe75d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe75e;</span>
                <div class="name">书签 阅读</div>
                <div class="code-name">&amp;#xe75e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe75f;</span>
                <div class="name">人脸识别 扫码</div>
                <div class="code-name">&amp;#xe75f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe760;</span>
                <div class="name">钱 金币</div>
                <div class="code-name">&amp;#xe760;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe761;</span>
                <div class="name">钱 人民币</div>
                <div class="code-name">&amp;#xe761;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe762;</span>
                <div class="name">钱包 卡包</div>
                <div class="code-name">&amp;#xe762;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe763;</span>
                <div class="name">指纹 识别 解锁</div>
                <div class="code-name">&amp;#xe763;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe764;</span>
                <div class="name">我  我的 头像</div>
                <div class="code-name">&amp;#xe764;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe765;</span>
                <div class="name">我的 头像 减少</div>
                <div class="code-name">&amp;#xe765;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe766;</span>
                <div class="name">我的 头像 增加</div>
                <div class="code-name">&amp;#xe766;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe767;</span>
                <div class="name">我的 头像 选择</div>
                <div class="code-name">&amp;#xe767;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe768;</span>
                <div class="name">印章 盖章</div>
                <div class="code-name">&amp;#xe768;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe769;</span>
                <div class="name">箭头 向左</div>
                <div class="code-name">&amp;#xe769;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe76a;</span>
                <div class="name">箭头 向右</div>
                <div class="code-name">&amp;#xe76a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe76b;</span>
                <div class="name">箭头 向下</div>
                <div class="code-name">&amp;#xe76b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe76c;</span>
                <div class="name">箭头 向上</div>
                <div class="code-name">&amp;#xe76c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe76d;</span>
                <div class="name">创新 科技</div>
                <div class="code-name">&amp;#xe76d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe76e;</span>
                <div class="name">电话本 通讯录</div>
                <div class="code-name">&amp;#xe76e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe772;</span>
                <div class="name">球 运动</div>
                <div class="code-name">&amp;#xe772;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe773;</span>
                <div class="name">云 天气</div>
                <div class="code-name">&amp;#xe773;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe774;</span>
                <div class="name">无人机 航拍 拍摄</div>
                <div class="code-name">&amp;#xe774;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe775;</span>
                <div class="name">企业 大厦</div>
                <div class="code-name">&amp;#xe775;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe776;</span>
                <div class="name">待办  等待 审核</div>
                <div class="code-name">&amp;#xe776;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ff;</span>
                <div class="name">首页 房子</div>
                <div class="code-name">&amp;#xe6ff;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe700;</span>
                <div class="name">表单 表格</div>
                <div class="code-name">&amp;#xe700;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe701;</span>
                <div class="name">表单 表格2</div>
                <div class="code-name">&amp;#xe701;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe702;</span>
                <div class="name">图片 照片</div>
                <div class="code-name">&amp;#xe702;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe703;</span>
                <div class="name">照相机 摄影</div>
                <div class="code-name">&amp;#xe703;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe704;</span>
                <div class="name">地图 坐标</div>
                <div class="code-name">&amp;#xe704;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe705;</span>
                <div class="name">垃圾桶  删除</div>
                <div class="code-name">&amp;#xe705;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe706;</span>
                <div class="name">时间 闹钟</div>
                <div class="code-name">&amp;#xe706;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe707;</span>
                <div class="name">锁 密码</div>
                <div class="code-name">&amp;#xe707;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe708;</span>
                <div class="name">错误 返回</div>
                <div class="code-name">&amp;#xe708;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe709;</span>
                <div class="name">正确 对的</div>
                <div class="code-name">&amp;#xe709;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe70a;</span>
                <div class="name">加 添加</div>
                <div class="code-name">&amp;#xe70a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe70b;</span>
                <div class="name">五角星 星型 </div>
                <div class="code-name">&amp;#xe70b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe70c;</span>
                <div class="name">提示 闹钟</div>
                <div class="code-name">&amp;#xe70c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe70d;</span>
                <div class="name">购物车 购物</div>
                <div class="code-name">&amp;#xe70d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe70f;</span>
                <div class="name">爱心  收藏</div>
                <div class="code-name">&amp;#xe70f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe710;</span>
                <div class="name">奖杯  胜利</div>
                <div class="code-name">&amp;#xe710;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe711;</span>
                <div class="name">筛选 过滤</div>
                <div class="code-name">&amp;#xe711;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe712;</span>
                <div class="name">日历 计划</div>
                <div class="code-name">&amp;#xe712;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe713;</span>
                <div class="name">手机 电话</div>
                <div class="code-name">&amp;#xe713;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe714;</span>
                <div class="name">电脑  显示器</div>
                <div class="code-name">&amp;#xe714;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe715;</span>
                <div class="name">输入 填写 笔</div>
                <div class="code-name">&amp;#xe715;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe716;</span>
                <div class="name">锁 打开 密码</div>
                <div class="code-name">&amp;#xe716;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe717;</span>
                <div class="name">打印机  传真</div>
                <div class="code-name">&amp;#xe717;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe718;</span>
                <div class="name">公文包 办公</div>
                <div class="code-name">&amp;#xe718;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe719;</span>
                <div class="name">对话 语音</div>
                <div class="code-name">&amp;#xe719;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe71a;</span>
                <div class="name">交流 语音</div>
                <div class="code-name">&amp;#xe71a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe71b;</span>
                <div class="name">交流 语音</div>
                <div class="code-name">&amp;#xe71b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe71c;</span>
                <div class="name">交流 语音</div>
                <div class="code-name">&amp;#xe71c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe71d;</span>
                <div class="name">更多 全部</div>
                <div class="code-name">&amp;#xe71d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe71e;</span>
                <div class="name">信封 信件</div>
                <div class="code-name">&amp;#xe71e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe71f;</span>
                <div class="name">信封 信件</div>
                <div class="code-name">&amp;#xe71f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe720;</span>
                <div class="name">系统 设置</div>
                <div class="code-name">&amp;#xe720;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe721;</span>
                <div class="name">证件 卡</div>
                <div class="code-name">&amp;#xe721;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe722;</span>
                <div class="name">证件 身份证</div>
                <div class="code-name">&amp;#xe722;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe723;</span>
                <div class="name">计算机 算数</div>
                <div class="code-name">&amp;#xe723;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe724;</span>
                <div class="name">麦克风 话筒 语音</div>
                <div class="code-name">&amp;#xe724;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe725;</span>
                <div class="name">发送 纸飞机</div>
                <div class="code-name">&amp;#xe725;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe726;</span>
                <div class="name">更多 全部 分类</div>
                <div class="code-name">&amp;#xe726;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe727;</span>
                <div class="name">通知 喇叭 声音</div>
                <div class="code-name">&amp;#xe727;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe729;</span>
                <div class="name">提示 叹号</div>
                <div class="code-name">&amp;#xe729;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe72a;</span>
                <div class="name">标识 方向</div>
                <div class="code-name">&amp;#xe72a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe72b;</span>
                <div class="name">文件 文件夹</div>
                <div class="code-name">&amp;#xe72b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe72c;</span>
                <div class="name">礼物 礼品</div>
                <div class="code-name">&amp;#xe72c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe72d;</span>
                <div class="name">防护 保护</div>
                <div class="code-name">&amp;#xe72d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe72e;</span>
                <div class="name">防护 保护2</div>
                <div class="code-name">&amp;#xe72e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe72f;</span>
                <div class="name">关闭 退出</div>
                <div class="code-name">&amp;#xe72f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe730;</span>
                <div class="name">WiFi 信号</div>
                <div class="code-name">&amp;#xe730;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe732;</span>
                <div class="name">火 热点  hot</div>
                <div class="code-name">&amp;#xe732;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe733;</span>
                <div class="name">目标 方向</div>
                <div class="code-name">&amp;#xe733;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe734;</span>
                <div class="name">咖啡 等待</div>
                <div class="code-name">&amp;#xe734;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe735;</span>
                <div class="name">救济包 救援包</div>
                <div class="code-name">&amp;#xe735;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe736;</span>
                <div class="name">扫码 扫描</div>
                <div class="code-name">&amp;#xe736;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe737;</span>
                <div class="name">二维码 扫描</div>
                <div class="code-name">&amp;#xe737;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe738;</span>
                <div class="name">条形码 扫描</div>
                <div class="code-name">&amp;#xe738;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe739;</span>
                <div class="name">电话 呼出</div>
                <div class="code-name">&amp;#xe739;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73b;</span>
                <div class="name">发明 创造</div>
                <div class="code-name">&amp;#xe73b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73c;</span>
                <div class="name">赞 点赞</div>
                <div class="code-name">&amp;#xe73c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73d;</span>
                <div class="name">耳机  语音</div>
                <div class="code-name">&amp;#xe73d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe740;</span>
                <div class="name">书 阅读</div>
                <div class="code-name">&amp;#xe740;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe741;</span>
                <div class="name">时间 等待</div>
                <div class="code-name">&amp;#xe741;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe742;</span>
                <div class="name">分享 链接</div>
                <div class="code-name">&amp;#xe742;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe743;</span>
                <div class="name">分享 链接</div>
                <div class="code-name">&amp;#xe743;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe744;</span>
                <div class="name">摄影机 录像</div>
                <div class="code-name">&amp;#xe744;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe745;</span>
                <div class="name">播放 视频</div>
                <div class="code-name">&amp;#xe745;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe746;</span>
                <div class="name">皇冠 冠军</div>
                <div class="code-name">&amp;#xe746;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe747;</span>
                <div class="name">包 购物</div>
                <div class="code-name">&amp;#xe747;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe748;</span>
                <div class="name">警报 报警</div>
                <div class="code-name">&amp;#xe748;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe749;</span>
                <div class="name">下载 云</div>
                <div class="code-name">&amp;#xe749;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe74a;</span>
                <div class="name">向左 箭头</div>
                <div class="code-name">&amp;#xe74a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe74b;</span>
                <div class="name">向右 箭头</div>
                <div class="code-name">&amp;#xe74b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe74c;</span>
                <div class="name">向上 箭头</div>
                <div class="code-name">&amp;#xe74c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe74d;</span>
                <div class="name">向下 箭头</div>
                <div class="code-name">&amp;#xe74d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe74e;</span>
                <div class="name">小火箭 发射</div>
                <div class="code-name">&amp;#xe74e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe74f;</span>
                <div class="name">安卓 系统</div>
                <div class="code-name">&amp;#xe74f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe750;</span>
                <div class="name">苹果 系统</div>
                <div class="code-name">&amp;#xe750;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe751;</span>
                <div class="name">放大镜 搜索</div>
                <div class="code-name">&amp;#xe751;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe752;</span>
                <div class="name">放大镜 搜索  缩小</div>
                <div class="code-name">&amp;#xe752;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe753;</span>
                <div class="name">放大镜 搜索  放大</div>
                <div class="code-name">&amp;#xe753;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe754;</span>
                <div class="name">筛选 分类</div>
                <div class="code-name">&amp;#xe754;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe755;</span>
                <div class="name">筛选 分类</div>
                <div class="code-name">&amp;#xe755;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe758;</span>
                <div class="name">表单 表格</div>
                <div class="code-name">&amp;#xe758;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe759;</span>
                <div class="name">存储 内存卡</div>
                <div class="code-name">&amp;#xe759;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe75a;</span>
                <div class="name">蓝牙 耳机</div>
                <div class="code-name">&amp;#xe75a;</div>
              </li>
          
          </ul>
          <div class="article markdown">
          <h2 id="unicode-">Unicode 引用</h2>
          <hr>

          <p>Unicode 是字体在网页端最原始的应用方式，特点是：</p>
          <ul>
            <li>兼容性最好，支持 IE6+，及所有现代浏览器。</li>
            <li>支持按字体的方式去动态调整图标大小，颜色等等。</li>
            <li>但是因为是字体，所以不支持多色。只能使用平台里单色的图标，就算项目里有多色图标也会自动去色。</li>
          </ul>
          <blockquote>
            <p>注意：新版 iconfont 支持多色图标，这些多色图标在 Unicode 模式下将不能使用，如果有需求建议使用symbol 的引用方式</p>
          </blockquote>
          <p>Unicode 使用步骤如下：</p>
          <h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3>
<pre><code class="language-css"
>@font-face {
  font-family: 'iconfont';
  src: url('iconfont.eot');
  src: url('iconfont.eot?#iefix') format('embedded-opentype'),
      url('iconfont.woff2') format('woff2'),
      url('iconfont.woff') format('woff'),
      url('iconfont.ttf') format('truetype'),
      url('iconfont.svg#iconfont') format('svg');
}
</code></pre>
          <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
<pre><code class="language-css"
>.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
</code></pre>
          <h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3>
<pre>
<code class="language-html"
>&lt;span class="iconfont"&gt;&amp;#x33;&lt;/span&gt;
</code></pre>
          <blockquote>
            <p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
          </blockquote>
          </div>
      </div>
      <div class="content font-class">
        <ul class="icon_lists dib-box">
          
          <li class="dib">
            <span class="icon iconfont icon-tongjibaobiao"></span>
            <div class="name">
              统计报表
            </div>
            <div class="code-name">.icon-tongjibaobiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xinxidengji"></span>
            <div class="name">
              信息登记
            </div>
            <div class="code-name">.icon-xinxidengji
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-chaxun1"></span>
            <div class="name">
              查询
            </div>
            <div class="code-name">.icon-chaxun1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-wuliu"></span>
            <div class="name">
              物流
            </div>
            <div class="code-name">.icon-wuliu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zhuxingtu"></span>
            <div class="name">
              柱形图
            </div>
            <div class="code-name">.icon-zhuxingtu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-pie-chart"></span>
            <div class="name">
              饼图
            </div>
            <div class="code-name">.icon-pie-chart
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mobanguanli"></span>
            <div class="name">
              模板管理
            </div>
            <div class="code-name">.icon-mobanguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon-"></span>
            <div class="name">
              折线图
            </div>
            <div class="code-name">.icon-icon-
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-navicon-tjb"></span>
            <div class="name">
              统计表
            </div>
            <div class="code-name">.icon-navicon-tjb
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jinduchaxun"></span>
            <div class="name">
              进度查询
            </div>
            <div class="code-name">.icon-jinduchaxun
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-baoyangzhijiandan_huaban"></span>
            <div class="name">
              保养质检单
            </div>
            <div class="code-name">.icon-baoyangzhijiandan_huaban
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-huichuan"></span>
            <div class="name">
              回传2
            </div>
            <div class="code-name">.icon-huichuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-lailiaozhijian-"></span>
            <div class="name">
              来料质检
            </div>
            <div class="code-name">.icon-lailiaozhijian-
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-cz-jl"></span>
            <div class="name">
              操作-记录
            </div>
            <div class="code-name">.icon-cz-jl
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-renwu"></span>
            <div class="name">
              党务任务管理
            </div>
            <div class="code-name">.icon-renwu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-rizhiyichang"></span>
            <div class="name">
              异常答复
            </div>
            <div class="code-name">.icon-rizhiyichang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-huabankaobei-"></span>
            <div class="name">
              快递，送货
            </div>
            <div class="code-name">.icon-huabankaobei-
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-caozuojilu"></span>
            <div class="name">
              操作记录
            </div>
            <div class="code-name">.icon-caozuojilu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jurassic_jiankong"></span>
            <div class="name">
              监控,追踪,跟踪_jurassic
            </div>
            <div class="code-name">.icon-jurassic_jiankong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shujuzidian"></span>
            <div class="name">
              数据字典
            </div>
            <div class="code-name">.icon-shujuzidian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-biaoge"></span>
            <div class="name">
              表格
            </div>
            <div class="code-name">.icon-biaoge
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-biaoge1"></span>
            <div class="name">
              表格
            </div>
            <div class="code-name">.icon-biaoge1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zu1773"></span>
            <div class="name">
              服务监控
            </div>
            <div class="code-name">.icon-zu1773
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dengji"></span>
            <div class="name">
              登记
            </div>
            <div class="code-name">.icon-dengji
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-paihangbang"></span>
            <div class="name">
              排行榜
            </div>
            <div class="code-name">.icon-paihangbang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shaohouchuli"></span>
            <div class="name">
              稍后处理
            </div>
            <div class="code-name">.icon-shaohouchuli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yaoqing"></span>
            <div class="name">
              邀请
            </div>
            <div class="code-name">.icon-yaoqing
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-quanzi"></span>
            <div class="name">
              圈子
            </div>
            <div class="code-name">.icon-quanzi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-lianjieduankai"></span>
            <div class="name">
              链接断开
            </div>
            <div class="code-name">.icon-lianjieduankai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xiaoxi"></span>
            <div class="name">
              消息
            </div>
            <div class="code-name">.icon-xiaoxi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shubiao"></span>
            <div class="name">
              鼠标
            </div>
            <div class="code-name">.icon-shubiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xiayi"></span>
            <div class="name">
              下移
            </div>
            <div class="code-name">.icon-xiayi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shangyi"></span>
            <div class="name">
              上移
            </div>
            <div class="code-name">.icon-shangyi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tongbu1"></span>
            <div class="name">
              同步1
            </div>
            <div class="code-name">.icon-tongbu1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shezhi"></span>
            <div class="name">
              设置
            </div>
            <div class="code-name">.icon-shezhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dayin"></span>
            <div class="name">
              打印
            </div>
            <div class="code-name">.icon-dayin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dianfeifapiao"></span>
            <div class="name">
              电费发票
            </div>
            <div class="code-name">.icon-dianfeifapiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dianzizhangdan"></span>
            <div class="name">
              电子账单
            </div>
            <div class="code-name">.icon-dianzizhangdan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-quanxianshang"></span>
            <div class="name">
              全线上
            </div>
            <div class="code-name">.icon-quanxianshang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-chaxun"></span>
            <div class="name">
              查询
            </div>
            <div class="code-name">.icon-chaxun
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-caozuo"></span>
            <div class="name">
              操作
            </div>
            <div class="code-name">.icon-caozuo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xiazaimoban"></span>
            <div class="name">
              下载模版
            </div>
            <div class="code-name">.icon-xiazaimoban
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-diqiu"></span>
            <div class="name">
              地球
            </div>
            <div class="code-name">.icon-diqiu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yinliangshengyin"></span>
            <div class="name">
              音量，声音
            </div>
            <div class="code-name">.icon-yinliangshengyin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-ceyan"></span>
            <div class="name">
              测验
            </div>
            <div class="code-name">.icon-ceyan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-gerenziliao"></span>
            <div class="name">
              个人资料
            </div>
            <div class="code-name">.icon-gerenziliao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-gengduo"></span>
            <div class="name">
              更多
            </div>
            <div class="code-name">.icon-gengduo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-ketangxiaoce"></span>
            <div class="name">
              课堂小测
            </div>
            <div class="code-name">.icon-ketangxiaoce
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-piliangguanli"></span>
            <div class="name">
              批量管理
            </div>
            <div class="code-name">.icon-piliangguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shouye"></span>
            <div class="name">
              首页
            </div>
            <div class="code-name">.icon-shouye
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-sucaizhongxin"></span>
            <div class="name">
              素材中心
            </div>
            <div class="code-name">.icon-sucaizhongxin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xitong"></span>
            <div class="name">
              系统
            </div>
            <div class="code-name">.icon-xitong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zhanghaozhongxinzhanghaoguanli"></span>
            <div class="name">
              账号中心 账号管理
            </div>
            <div class="code-name">.icon-zhanghaozhongxinzhanghaoguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-ziyuanku"></span>
            <div class="name">
              资源库
            </div>
            <div class="code-name">.icon-ziyuanku
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-ziyuanpingtaiguanli"></span>
            <div class="name">
              资源平台管理
            </div>
            <div class="code-name">.icon-ziyuanpingtaiguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yunweiguanli"></span>
            <div class="name">
              运维管理
            </div>
            <div class="code-name">.icon-yunweiguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-buju"></span>
            <div class="name">
              布局
            </div>
            <div class="code-name">.icon-buju
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-liucheng"></span>
            <div class="name">
              流程
            </div>
            <div class="code-name">.icon-liucheng
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yonghu"></span>
            <div class="name">
              用户
            </div>
            <div class="code-name">.icon-yonghu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shenpizhongxin"></span>
            <div class="name">
              审批中心
            </div>
            <div class="code-name">.icon-shenpizhongxin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tubiao"></span>
            <div class="name">
              图表
            </div>
            <div class="code-name">.icon-tubiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-ziyuanxiazai"></span>
            <div class="name">
              资源下载
            </div>
            <div class="code-name">.icon-ziyuanxiazai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-quanxianshenqing"></span>
            <div class="name">
              权限申请
            </div>
            <div class="code-name">.icon-quanxianshenqing
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-87"></span>
            <div class="name">
              花朵 设置 系统
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-87
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-91"></span>
            <div class="name">
              雨伞 防护
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-91
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-49"></span>
            <div class="name">
              发现 新球
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-49
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-63"></span>
            <div class="name">
              发现 阅读 观看
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-63
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-huigun"></span>
            <div class="name">
              回滚
            </div>
            <div class="code-name">.icon-huigun
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-92"></span>
            <div class="name">
              摄像头 监控
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-92
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-93"></span>
            <div class="name">
              荣誉 金牌
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-93
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-94"></span>
            <div class="name">
              书签 阅读
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-94
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-95"></span>
            <div class="name">
              人脸识别 扫码
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-95
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-96"></span>
            <div class="name">
              钱 金币
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-96
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-97"></span>
            <div class="name">
              钱 人民币
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-97
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-98"></span>
            <div class="name">
              钱包 卡包
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-98
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-99"></span>
            <div class="name">
              指纹 识别 解锁
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-99
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-100"></span>
            <div class="name">
              我  我的 头像
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-100
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-101"></span>
            <div class="name">
              我的 头像 减少
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-101
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-102"></span>
            <div class="name">
              我的 头像 增加
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-102
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-103"></span>
            <div class="name">
              我的 头像 选择
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-103
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-104"></span>
            <div class="name">
              印章 盖章
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-104
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-105"></span>
            <div class="name">
              箭头 向左
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-105
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-106"></span>
            <div class="name">
              箭头 向右
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-106
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-107"></span>
            <div class="name">
              箭头 向下
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-107
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-108"></span>
            <div class="name">
              箭头 向上
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-108
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-109"></span>
            <div class="name">
              创新 科技
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-109
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-110"></span>
            <div class="name">
              电话本 通讯录
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-110
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-114"></span>
            <div class="name">
              球 运动
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-114
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-115"></span>
            <div class="name">
              云 天气
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-115
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-116"></span>
            <div class="name">
              无人机 航拍 拍摄
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-116
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-117"></span>
            <div class="name">
              企业 大厦
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-117
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-118"></span>
            <div class="name">
              待办  等待 审核
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-118
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu_huaban"></span>
            <div class="name">
              首页 房子
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu_huaban
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-"></span>
            <div class="name">
              表单 表格
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-1"></span>
            <div class="name">
              表单 表格2
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-2"></span>
            <div class="name">
              图片 照片
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-3"></span>
            <div class="name">
              照相机 摄影
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-3
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-4"></span>
            <div class="name">
              地图 坐标
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-4
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-5"></span>
            <div class="name">
              垃圾桶  删除
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-5
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-6"></span>
            <div class="name">
              时间 闹钟
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-6
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-7"></span>
            <div class="name">
              锁 密码
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-7
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-8"></span>
            <div class="name">
              错误 返回
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-8
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-9"></span>
            <div class="name">
              正确 对的
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-9
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-10"></span>
            <div class="name">
              加 添加
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-10
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-11"></span>
            <div class="name">
              五角星 星型 
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-11
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-12"></span>
            <div class="name">
              提示 闹钟
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-12
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-13"></span>
            <div class="name">
              购物车 购物
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-13
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-15"></span>
            <div class="name">
              爱心  收藏
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-15
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-16"></span>
            <div class="name">
              奖杯  胜利
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-16
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-17"></span>
            <div class="name">
              筛选 过滤
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-17
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-18"></span>
            <div class="name">
              日历 计划
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-18
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-19"></span>
            <div class="name">
              手机 电话
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-19
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-20"></span>
            <div class="name">
              电脑  显示器
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-20
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-21"></span>
            <div class="name">
              输入 填写 笔
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-21
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-22"></span>
            <div class="name">
              锁 打开 密码
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-22
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-23"></span>
            <div class="name">
              打印机  传真
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-23
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-24"></span>
            <div class="name">
              公文包 办公
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-24
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-25"></span>
            <div class="name">
              对话 语音
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-25
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-26"></span>
            <div class="name">
              交流 语音
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-26
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-27"></span>
            <div class="name">
              交流 语音
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-27
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-28"></span>
            <div class="name">
              交流 语音
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-28
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-29"></span>
            <div class="name">
              更多 全部
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-29
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-30"></span>
            <div class="name">
              信封 信件
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-30
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-31"></span>
            <div class="name">
              信封 信件
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-31
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-32"></span>
            <div class="name">
              系统 设置
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-32
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-33"></span>
            <div class="name">
              证件 卡
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-33
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-34"></span>
            <div class="name">
              证件 身份证
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-34
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-35"></span>
            <div class="name">
              计算机 算数
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-35
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-36"></span>
            <div class="name">
              麦克风 话筒 语音
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-36
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-37"></span>
            <div class="name">
              发送 纸飞机
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-37
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-38"></span>
            <div class="name">
              更多 全部 分类
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-38
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-39"></span>
            <div class="name">
              通知 喇叭 声音
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-39
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-41"></span>
            <div class="name">
              提示 叹号
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-41
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-42"></span>
            <div class="name">
              标识 方向
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-42
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-43"></span>
            <div class="name">
              文件 文件夹
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-43
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-44"></span>
            <div class="name">
              礼物 礼品
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-44
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-45"></span>
            <div class="name">
              防护 保护
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-45
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-46"></span>
            <div class="name">
              防护 保护2
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-46
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-47"></span>
            <div class="name">
              关闭 退出
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-47
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-48"></span>
            <div class="name">
              WiFi 信号
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-48
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-50"></span>
            <div class="name">
              火 热点  hot
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-50
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-51"></span>
            <div class="name">
              目标 方向
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-51
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-52"></span>
            <div class="name">
              咖啡 等待
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-52
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-53"></span>
            <div class="name">
              救济包 救援包
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-53
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-54"></span>
            <div class="name">
              扫码 扫描
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-54
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-55"></span>
            <div class="name">
              二维码 扫描
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-55
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-56"></span>
            <div class="name">
              条形码 扫描
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-56
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-57"></span>
            <div class="name">
              电话 呼出
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-57
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-59"></span>
            <div class="name">
              发明 创造
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-59
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-60"></span>
            <div class="name">
              赞 点赞
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-60
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-61"></span>
            <div class="name">
              耳机  语音
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-61
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-64"></span>
            <div class="name">
              书 阅读
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-64
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-65"></span>
            <div class="name">
              时间 等待
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-65
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-66"></span>
            <div class="name">
              分享 链接
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-66
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-67"></span>
            <div class="name">
              分享 链接
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-67
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-68"></span>
            <div class="name">
              摄影机 录像
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-68
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-69"></span>
            <div class="name">
              播放 视频
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-69
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-70"></span>
            <div class="name">
              皇冠 冠军
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-70
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-71"></span>
            <div class="name">
              包 购物
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-71
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-72"></span>
            <div class="name">
              警报 报警
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-72
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-73"></span>
            <div class="name">
              下载 云
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-73
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-74"></span>
            <div class="name">
              向左 箭头
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-74
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-75"></span>
            <div class="name">
              向右 箭头
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-75
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-76"></span>
            <div class="name">
              向上 箭头
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-76
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-77"></span>
            <div class="name">
              向下 箭头
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-77
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-78"></span>
            <div class="name">
              小火箭 发射
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-78
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-79"></span>
            <div class="name">
              安卓 系统
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-79
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-80"></span>
            <div class="name">
              苹果 系统
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-80
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-81"></span>
            <div class="name">
              放大镜 搜索
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-81
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-82"></span>
            <div class="name">
              放大镜 搜索  缩小
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-82
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-83"></span>
            <div class="name">
              放大镜 搜索  放大
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-83
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-84"></span>
            <div class="name">
              筛选 分类
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-84
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-85"></span>
            <div class="name">
              筛选 分类
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-85
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-88"></span>
            <div class="name">
              表单 表格
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-88
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-89"></span>
            <div class="name">
              存储 内存卡
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-89
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu-90"></span>
            <div class="name">
              蓝牙 耳机
            </div>
            <div class="code-name">.icon-changyongtubiao-xianxingdaochu-zhuanqu-90
            </div>
          </li>
          
        </ul>
        <div class="article markdown">
        <h2 id="font-class-">font-class 引用</h2>
        <hr>

        <p>font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。</p>
        <p>与 Unicode 使用方式相比，具有如下特点：</p>
        <ul>
          <li>兼容性良好，支持 IE8+，及所有现代浏览器。</li>
          <li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li>
          <li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li>
          <li>不过因为本质上还是使用的字体，所以多色图标还是不支持的。</li>
        </ul>
        <p>使用步骤如下：</p>
        <h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3>
<pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
</code></pre>
        <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;span class="iconfont icon-xxx"&gt;&lt;/span&gt;
</code></pre>
        <blockquote>
          <p>"
            iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
        </blockquote>
      </div>
      </div>
      <div class="content symbol">
          <ul class="icon_lists dib-box">
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tongjibaobiao"></use>
                </svg>
                <div class="name">统计报表</div>
                <div class="code-name">#icon-tongjibaobiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xinxidengji"></use>
                </svg>
                <div class="name">信息登记</div>
                <div class="code-name">#icon-xinxidengji</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-chaxun1"></use>
                </svg>
                <div class="name">查询</div>
                <div class="code-name">#icon-chaxun1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-wuliu"></use>
                </svg>
                <div class="name">物流</div>
                <div class="code-name">#icon-wuliu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zhuxingtu"></use>
                </svg>
                <div class="name">柱形图</div>
                <div class="code-name">#icon-zhuxingtu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-pie-chart"></use>
                </svg>
                <div class="name">饼图</div>
                <div class="code-name">#icon-pie-chart</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mobanguanli"></use>
                </svg>
                <div class="name">模板管理</div>
                <div class="code-name">#icon-mobanguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon-"></use>
                </svg>
                <div class="name">折线图</div>
                <div class="code-name">#icon-icon-</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-navicon-tjb"></use>
                </svg>
                <div class="name">统计表</div>
                <div class="code-name">#icon-navicon-tjb</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jinduchaxun"></use>
                </svg>
                <div class="name">进度查询</div>
                <div class="code-name">#icon-jinduchaxun</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-baoyangzhijiandan_huaban"></use>
                </svg>
                <div class="name">保养质检单</div>
                <div class="code-name">#icon-baoyangzhijiandan_huaban</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-huichuan"></use>
                </svg>
                <div class="name">回传2</div>
                <div class="code-name">#icon-huichuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-lailiaozhijian-"></use>
                </svg>
                <div class="name">来料质检</div>
                <div class="code-name">#icon-lailiaozhijian-</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-cz-jl"></use>
                </svg>
                <div class="name">操作-记录</div>
                <div class="code-name">#icon-cz-jl</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-renwu"></use>
                </svg>
                <div class="name">党务任务管理</div>
                <div class="code-name">#icon-renwu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-rizhiyichang"></use>
                </svg>
                <div class="name">异常答复</div>
                <div class="code-name">#icon-rizhiyichang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-huabankaobei-"></use>
                </svg>
                <div class="name">快递，送货</div>
                <div class="code-name">#icon-huabankaobei-</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-caozuojilu"></use>
                </svg>
                <div class="name">操作记录</div>
                <div class="code-name">#icon-caozuojilu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jurassic_jiankong"></use>
                </svg>
                <div class="name">监控,追踪,跟踪_jurassic</div>
                <div class="code-name">#icon-jurassic_jiankong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shujuzidian"></use>
                </svg>
                <div class="name">数据字典</div>
                <div class="code-name">#icon-shujuzidian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-biaoge"></use>
                </svg>
                <div class="name">表格</div>
                <div class="code-name">#icon-biaoge</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-biaoge1"></use>
                </svg>
                <div class="name">表格</div>
                <div class="code-name">#icon-biaoge1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zu1773"></use>
                </svg>
                <div class="name">服务监控</div>
                <div class="code-name">#icon-zu1773</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dengji"></use>
                </svg>
                <div class="name">登记</div>
                <div class="code-name">#icon-dengji</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-paihangbang"></use>
                </svg>
                <div class="name">排行榜</div>
                <div class="code-name">#icon-paihangbang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shaohouchuli"></use>
                </svg>
                <div class="name">稍后处理</div>
                <div class="code-name">#icon-shaohouchuli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yaoqing"></use>
                </svg>
                <div class="name">邀请</div>
                <div class="code-name">#icon-yaoqing</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-quanzi"></use>
                </svg>
                <div class="name">圈子</div>
                <div class="code-name">#icon-quanzi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-lianjieduankai"></use>
                </svg>
                <div class="name">链接断开</div>
                <div class="code-name">#icon-lianjieduankai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xiaoxi"></use>
                </svg>
                <div class="name">消息</div>
                <div class="code-name">#icon-xiaoxi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shubiao"></use>
                </svg>
                <div class="name">鼠标</div>
                <div class="code-name">#icon-shubiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xiayi"></use>
                </svg>
                <div class="name">下移</div>
                <div class="code-name">#icon-xiayi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shangyi"></use>
                </svg>
                <div class="name">上移</div>
                <div class="code-name">#icon-shangyi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tongbu1"></use>
                </svg>
                <div class="name">同步1</div>
                <div class="code-name">#icon-tongbu1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shezhi"></use>
                </svg>
                <div class="name">设置</div>
                <div class="code-name">#icon-shezhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dayin"></use>
                </svg>
                <div class="name">打印</div>
                <div class="code-name">#icon-dayin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dianfeifapiao"></use>
                </svg>
                <div class="name">电费发票</div>
                <div class="code-name">#icon-dianfeifapiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dianzizhangdan"></use>
                </svg>
                <div class="name">电子账单</div>
                <div class="code-name">#icon-dianzizhangdan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-quanxianshang"></use>
                </svg>
                <div class="name">全线上</div>
                <div class="code-name">#icon-quanxianshang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-chaxun"></use>
                </svg>
                <div class="name">查询</div>
                <div class="code-name">#icon-chaxun</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-caozuo"></use>
                </svg>
                <div class="name">操作</div>
                <div class="code-name">#icon-caozuo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xiazaimoban"></use>
                </svg>
                <div class="name">下载模版</div>
                <div class="code-name">#icon-xiazaimoban</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-diqiu"></use>
                </svg>
                <div class="name">地球</div>
                <div class="code-name">#icon-diqiu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yinliangshengyin"></use>
                </svg>
                <div class="name">音量，声音</div>
                <div class="code-name">#icon-yinliangshengyin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-ceyan"></use>
                </svg>
                <div class="name">测验</div>
                <div class="code-name">#icon-ceyan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-gerenziliao"></use>
                </svg>
                <div class="name">个人资料</div>
                <div class="code-name">#icon-gerenziliao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-gengduo"></use>
                </svg>
                <div class="name">更多</div>
                <div class="code-name">#icon-gengduo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-ketangxiaoce"></use>
                </svg>
                <div class="name">课堂小测</div>
                <div class="code-name">#icon-ketangxiaoce</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-piliangguanli"></use>
                </svg>
                <div class="name">批量管理</div>
                <div class="code-name">#icon-piliangguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shouye"></use>
                </svg>
                <div class="name">首页</div>
                <div class="code-name">#icon-shouye</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-sucaizhongxin"></use>
                </svg>
                <div class="name">素材中心</div>
                <div class="code-name">#icon-sucaizhongxin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xitong"></use>
                </svg>
                <div class="name">系统</div>
                <div class="code-name">#icon-xitong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zhanghaozhongxinzhanghaoguanli"></use>
                </svg>
                <div class="name">账号中心 账号管理</div>
                <div class="code-name">#icon-zhanghaozhongxinzhanghaoguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-ziyuanku"></use>
                </svg>
                <div class="name">资源库</div>
                <div class="code-name">#icon-ziyuanku</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-ziyuanpingtaiguanli"></use>
                </svg>
                <div class="name">资源平台管理</div>
                <div class="code-name">#icon-ziyuanpingtaiguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yunweiguanli"></use>
                </svg>
                <div class="name">运维管理</div>
                <div class="code-name">#icon-yunweiguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-buju"></use>
                </svg>
                <div class="name">布局</div>
                <div class="code-name">#icon-buju</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-liucheng"></use>
                </svg>
                <div class="name">流程</div>
                <div class="code-name">#icon-liucheng</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yonghu"></use>
                </svg>
                <div class="name">用户</div>
                <div class="code-name">#icon-yonghu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shenpizhongxin"></use>
                </svg>
                <div class="name">审批中心</div>
                <div class="code-name">#icon-shenpizhongxin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tubiao"></use>
                </svg>
                <div class="name">图表</div>
                <div class="code-name">#icon-tubiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-ziyuanxiazai"></use>
                </svg>
                <div class="name">资源下载</div>
                <div class="code-name">#icon-ziyuanxiazai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-quanxianshenqing"></use>
                </svg>
                <div class="name">权限申请</div>
                <div class="code-name">#icon-quanxianshenqing</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-87"></use>
                </svg>
                <div class="name">花朵 设置 系统</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-87</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-91"></use>
                </svg>
                <div class="name">雨伞 防护</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-91</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-49"></use>
                </svg>
                <div class="name">发现 新球</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-49</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-63"></use>
                </svg>
                <div class="name">发现 阅读 观看</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-63</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-huigun"></use>
                </svg>
                <div class="name">回滚</div>
                <div class="code-name">#icon-huigun</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-92"></use>
                </svg>
                <div class="name">摄像头 监控</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-92</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-93"></use>
                </svg>
                <div class="name">荣誉 金牌</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-93</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-94"></use>
                </svg>
                <div class="name">书签 阅读</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-94</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-95"></use>
                </svg>
                <div class="name">人脸识别 扫码</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-95</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-96"></use>
                </svg>
                <div class="name">钱 金币</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-96</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-97"></use>
                </svg>
                <div class="name">钱 人民币</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-97</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-98"></use>
                </svg>
                <div class="name">钱包 卡包</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-98</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-99"></use>
                </svg>
                <div class="name">指纹 识别 解锁</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-99</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-100"></use>
                </svg>
                <div class="name">我  我的 头像</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-100</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-101"></use>
                </svg>
                <div class="name">我的 头像 减少</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-101</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-102"></use>
                </svg>
                <div class="name">我的 头像 增加</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-102</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-103"></use>
                </svg>
                <div class="name">我的 头像 选择</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-103</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-104"></use>
                </svg>
                <div class="name">印章 盖章</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-104</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-105"></use>
                </svg>
                <div class="name">箭头 向左</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-105</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-106"></use>
                </svg>
                <div class="name">箭头 向右</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-106</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-107"></use>
                </svg>
                <div class="name">箭头 向下</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-107</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-108"></use>
                </svg>
                <div class="name">箭头 向上</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-108</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-109"></use>
                </svg>
                <div class="name">创新 科技</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-109</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-110"></use>
                </svg>
                <div class="name">电话本 通讯录</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-110</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-114"></use>
                </svg>
                <div class="name">球 运动</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-114</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-115"></use>
                </svg>
                <div class="name">云 天气</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-115</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-116"></use>
                </svg>
                <div class="name">无人机 航拍 拍摄</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-116</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-117"></use>
                </svg>
                <div class="name">企业 大厦</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-117</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-118"></use>
                </svg>
                <div class="name">待办  等待 审核</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-118</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu_huaban"></use>
                </svg>
                <div class="name">首页 房子</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu_huaban</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-"></use>
                </svg>
                <div class="name">表单 表格</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-1"></use>
                </svg>
                <div class="name">表单 表格2</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-2"></use>
                </svg>
                <div class="name">图片 照片</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-3"></use>
                </svg>
                <div class="name">照相机 摄影</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-3</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-4"></use>
                </svg>
                <div class="name">地图 坐标</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-4</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-5"></use>
                </svg>
                <div class="name">垃圾桶  删除</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-5</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-6"></use>
                </svg>
                <div class="name">时间 闹钟</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-6</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-7"></use>
                </svg>
                <div class="name">锁 密码</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-7</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-8"></use>
                </svg>
                <div class="name">错误 返回</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-8</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-9"></use>
                </svg>
                <div class="name">正确 对的</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-9</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-10"></use>
                </svg>
                <div class="name">加 添加</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-10</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-11"></use>
                </svg>
                <div class="name">五角星 星型 </div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-11</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-12"></use>
                </svg>
                <div class="name">提示 闹钟</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-12</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-13"></use>
                </svg>
                <div class="name">购物车 购物</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-13</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-15"></use>
                </svg>
                <div class="name">爱心  收藏</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-15</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-16"></use>
                </svg>
                <div class="name">奖杯  胜利</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-16</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-17"></use>
                </svg>
                <div class="name">筛选 过滤</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-17</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-18"></use>
                </svg>
                <div class="name">日历 计划</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-18</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-19"></use>
                </svg>
                <div class="name">手机 电话</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-19</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-20"></use>
                </svg>
                <div class="name">电脑  显示器</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-20</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-21"></use>
                </svg>
                <div class="name">输入 填写 笔</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-21</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-22"></use>
                </svg>
                <div class="name">锁 打开 密码</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-22</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-23"></use>
                </svg>
                <div class="name">打印机  传真</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-23</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-24"></use>
                </svg>
                <div class="name">公文包 办公</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-24</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-25"></use>
                </svg>
                <div class="name">对话 语音</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-25</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-26"></use>
                </svg>
                <div class="name">交流 语音</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-26</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-27"></use>
                </svg>
                <div class="name">交流 语音</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-27</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-28"></use>
                </svg>
                <div class="name">交流 语音</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-28</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-29"></use>
                </svg>
                <div class="name">更多 全部</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-29</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-30"></use>
                </svg>
                <div class="name">信封 信件</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-30</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-31"></use>
                </svg>
                <div class="name">信封 信件</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-31</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-32"></use>
                </svg>
                <div class="name">系统 设置</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-32</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-33"></use>
                </svg>
                <div class="name">证件 卡</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-33</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-34"></use>
                </svg>
                <div class="name">证件 身份证</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-34</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-35"></use>
                </svg>
                <div class="name">计算机 算数</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-35</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-36"></use>
                </svg>
                <div class="name">麦克风 话筒 语音</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-36</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-37"></use>
                </svg>
                <div class="name">发送 纸飞机</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-37</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-38"></use>
                </svg>
                <div class="name">更多 全部 分类</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-38</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-39"></use>
                </svg>
                <div class="name">通知 喇叭 声音</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-39</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-41"></use>
                </svg>
                <div class="name">提示 叹号</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-41</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-42"></use>
                </svg>
                <div class="name">标识 方向</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-42</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-43"></use>
                </svg>
                <div class="name">文件 文件夹</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-43</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-44"></use>
                </svg>
                <div class="name">礼物 礼品</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-44</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-45"></use>
                </svg>
                <div class="name">防护 保护</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-45</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-46"></use>
                </svg>
                <div class="name">防护 保护2</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-46</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-47"></use>
                </svg>
                <div class="name">关闭 退出</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-47</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-48"></use>
                </svg>
                <div class="name">WiFi 信号</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-48</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-50"></use>
                </svg>
                <div class="name">火 热点  hot</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-50</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-51"></use>
                </svg>
                <div class="name">目标 方向</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-51</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-52"></use>
                </svg>
                <div class="name">咖啡 等待</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-52</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-53"></use>
                </svg>
                <div class="name">救济包 救援包</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-53</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-54"></use>
                </svg>
                <div class="name">扫码 扫描</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-54</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-55"></use>
                </svg>
                <div class="name">二维码 扫描</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-55</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-56"></use>
                </svg>
                <div class="name">条形码 扫描</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-56</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-57"></use>
                </svg>
                <div class="name">电话 呼出</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-57</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-59"></use>
                </svg>
                <div class="name">发明 创造</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-59</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-60"></use>
                </svg>
                <div class="name">赞 点赞</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-60</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-61"></use>
                </svg>
                <div class="name">耳机  语音</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-61</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-64"></use>
                </svg>
                <div class="name">书 阅读</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-64</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-65"></use>
                </svg>
                <div class="name">时间 等待</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-65</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-66"></use>
                </svg>
                <div class="name">分享 链接</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-66</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-67"></use>
                </svg>
                <div class="name">分享 链接</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-67</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-68"></use>
                </svg>
                <div class="name">摄影机 录像</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-68</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-69"></use>
                </svg>
                <div class="name">播放 视频</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-69</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-70"></use>
                </svg>
                <div class="name">皇冠 冠军</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-70</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-71"></use>
                </svg>
                <div class="name">包 购物</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-71</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-72"></use>
                </svg>
                <div class="name">警报 报警</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-72</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-73"></use>
                </svg>
                <div class="name">下载 云</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-73</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-74"></use>
                </svg>
                <div class="name">向左 箭头</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-74</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-75"></use>
                </svg>
                <div class="name">向右 箭头</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-75</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-76"></use>
                </svg>
                <div class="name">向上 箭头</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-76</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-77"></use>
                </svg>
                <div class="name">向下 箭头</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-77</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-78"></use>
                </svg>
                <div class="name">小火箭 发射</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-78</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-79"></use>
                </svg>
                <div class="name">安卓 系统</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-79</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-80"></use>
                </svg>
                <div class="name">苹果 系统</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-80</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-81"></use>
                </svg>
                <div class="name">放大镜 搜索</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-81</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-82"></use>
                </svg>
                <div class="name">放大镜 搜索  缩小</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-82</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-83"></use>
                </svg>
                <div class="name">放大镜 搜索  放大</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-83</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-84"></use>
                </svg>
                <div class="name">筛选 分类</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-84</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-85"></use>
                </svg>
                <div class="name">筛选 分类</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-85</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-88"></use>
                </svg>
                <div class="name">表单 表格</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-88</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-89"></use>
                </svg>
                <div class="name">存储 内存卡</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-89</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-xianxingdaochu-zhuanqu-90"></use>
                </svg>
                <div class="name">蓝牙 耳机</div>
                <div class="code-name">#icon-changyongtubiao-xianxingdaochu-zhuanqu-90</div>
            </li>
          
          </ul>
          <div class="article markdown">
          <h2 id="symbol-">Symbol 引用</h2>
          <hr>

          <p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
            这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：</p>
          <ul>
            <li>支持多色图标了，不再受单色限制。</li>
            <li>通过一些技巧，支持像字体那样，通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
            <li>兼容性较差，支持 IE9+，及现代浏览器。</li>
            <li>浏览器渲染 SVG 的性能一般，还不如 png。</li>
          </ul>
          <p>使用步骤如下：</p>
          <h3 id="-symbol-">第一步：引入项目下面生成的 symbol 代码：</h3>
<pre><code class="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;
</code></pre>
          <h3 id="-css-">第二步：加入通用 CSS 代码（引入一次就行）：</h3>
<pre><code class="language-html">&lt;style&gt;
.icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}
&lt;/style&gt;
</code></pre>
          <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt;
  &lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
&lt;/svg&gt;
</code></pre>
          </div>
      </div>

    </div>
  </div>
  <script>
  $(document).ready(function () {
      $('.tab-container .content:first').show()

      $('#tabs li').click(function (e) {
        var tabContent = $('.tab-container .content')
        var index = $(this).index()

        if ($(this).hasClass('active')) {
          return
        } else {
          $('#tabs li').removeClass('active')
          $(this).addClass('active')

          tabContent.hide().eq(index).fadeIn()
        }
      })
    })
  </script>
</body>
</html>
